

<template>
  <wd-toast></wd-toast>
<view class="p-20rpx h-100vh bg-#e6e6e6">
  <wd-card title="解析结果" class="p-0" v-if="imgText">
    {{ imgText }}
    <template #footer>
      <wd-button size="small" plain @click="copyText">复制</wd-button>
    </template>
  </wd-card>
  <wd-button @click="orcBtn" block>上传识别图片</wd-button>
</view>
</template>
<script setup lang="ts">
import { useToast, useMessage} from 'wot-design-uni'
import {ref,} from 'vue'
const message = useMessage()
const {
  show: showToast,
  loading: showLoading,
  close: hideLoading
} = useToast()
import {createWorker} from "tesseract.js";
const imgText = ref('')
const getOrc = (url) =>{
  return new Promise( async(resolve, reject)=>{
    const worker = await createWorker('chi_sim');
    const ret = await worker.recognize(url);
    console.log(ret.data.text);
    await worker.terminate();
    resolve(ret.data.text)
  })

}
const orcBtn = () => {
  uni.chooseImage({
    success: chooseImageRes => {
      showLoading({ loadingType: "ring", msg: "解析中" });
      const tempFilePaths = chooseImageRes.tempFilePaths;
      uniCloud.uploadFile({
        filePath: tempFilePaths[0],
        cloudPath: 'upload/' + new Date().getTime() + '.png',
        success: async uploadFileRes => {
          imgText.value = await getOrc(uploadFileRes.fileID) as any
          if(imgText.value){
            showToast({ msg: "解析成功" });
            hideLoading()
          }
          console.log(uploadFileRes.fileID);
        },
        fail: err => {
          console.error(err);
        }
      });
    }
  });
}
const copyText = () =>{
  uni.setClipboardData({
    data: imgText.value,
  })
}
</script>
<style scoped lang="scss">

</style>